<!-- 首页 -->
<template>
	<view class="home-wrap u-m-b-20">
		<!-- 空白页 -->
		<!-- #ifdef APP-PLUS -->
		<u-no-network @retry="init"></u-no-network>
		<!-- #endif -->
		<shopro-empty v-if="!hasTemplate" :image="$IMG_URL + '/imgs/empty/template_empty.png'" tipText="暂未找到模板，请前往装修~">
		</shopro-empty>

		<view v-else-if="isConnected && isRefresh" class="content-box">
			<!-- <view  class="content-box"> -->
			<!-- 导航栏 -->
			<!-- 	<home-head v-if="headSwiperList && headSwiperList.length" :scrollTop="scrollTop" borderRadius="0"
				:navTitle="initShop.name" :list="headSwiperList"></home-head> -->

			<sunNav></sunNav>
			<!-- 自定义模块 -->
			<view class="template-box" :style="{paddingTop:customBar+179 + 'rpx',
			backgroundSize:'100%'}">

				<block v-for="(item, index) in homeTemplate" :key="item.id">
					<!-- 轮播 -->
					<sh-banner v-if="item.type === 'banner' && index !== 0" :Px="item.content.x" :Py="item.content.y"
						:borderRadius="item.content.radius" :height="item.content.height" :list="item.content.list">
					</sh-banner>

					<!-- 搜索 -->
					<sh-search v-if="item.type === 'search'"></sh-search>

					<!-- 滑动宫格 -->
					<sh-grid-swiper v-if="item.type === 'menu'" :list="item.content.list"
						:oneRowNum="item.content.style"></sh-grid-swiper>

					<view class="brand" v-if="item.type === 'menu'">
						<image :src="$BASE_URL + bg.brand" mode="aspectFill"></image>
					</view>


					<sunHot ref="sunhot" v-if="item.type === 'goods-list'" :hotTitle='bg.hotTitle'
						:scrollTop='scrollTop' :goodelist2='goodelist2' :list='list' :emptyPic='emptyPic'
						@getGoodslist='gethotList'></sunHot>

					<!-- <sunthreeCard v-if="switchShow &&item.type === 'goods-list'" :threeCard='threeCard'></sunthreeCard> -->

					<sunTab ref="suntab" v-if="item.type === 'goods-list'" :scrollTop='scrollTop' :list='popularityList'
						@sendCategory='sendCategoryFn'></sunTab>
					<!-- 推荐商品 -->
					<sh-hot-goods ref="hotgood" v-if="item.type === 'goods-list' || item.type === 'goods-group'"
						:detail="item.content" :catid='CategoryId' :emptyPic='emptyPic'></sh-hot-goods>
					<!-- 广告魔方 -->
					<sh-adv v-if="item.type === 'adv'" :detail="item.content"></sh-adv>
					<!-- 优惠券 -->
					<sh-coupon v-if="item.type === 'coupons'" :detail="item.content"></sh-coupon>
					<!-- 秒杀-->
					<sh-seckill v-if="item.type === 'seckill'" :detail="item.content"></sh-seckill>
					<!-- 拼团 -->
					<sh-groupon v-if="item.type === 'groupon'" :detail="item.content"></sh-groupon>
					<!-- 富文本 -->
					<sh-richtext v-if="item.type === 'rich-text'" :richId="item.content.id"></sh-richtext>
					<!-- 功能标题 -->
					<sh-title-card v-if="item.type === 'title-block'" :title="item.content.name"
						:bgImage="item.content.image" :titleColor="item.content.color"></sh-title-card>
					<!-- 直播 -->
					<!-- #ifdef MP-WEIXIN -->
					<sh-live v-if="item.type === 'live' && HAS_LIVE" :detail="item.content"></sh-live>
					<!-- #endif -->
				</block>
			</view>

			<!-- 分类选项卡 -->
			<sh-category-tabs
				v-if="categoryTabsData && categoryTabsData.category_arr && categoryTabsData.category_arr.length"
				:enable="enable" :styleType="categoryTabsData.style" :tabsList="categoryTabsData.category_arr">
			</sh-category-tabs>
			<!-- 登录提示 -->
			<shopro-auth-modal></shopro-auth-modal>
			<!-- 悬浮按钮 -->
			<!-- <shopro-float-btn></shopro-float-btn> -->
			<!-- 连续弹窗提醒 -->
			<!-- <shopro-notice-modal v-if="!showPrivacy && isLogin"></shopro-notice-modal> -->
			<!-- 隐私协议 -->
			<!-- #ifdef APP-PLUS -->
			<!-- <privacy-modal v-if="initShop && initShop.name" v-model="showPrivacy"></privacy-modal> -->
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view class="tabbar-hack" style="height: 120rpx; width:100%;"></view>
			<!-- #endif -->
		</view>
		<!-- <shopro-tabbar></shopro-tabbar> -->
	</view>
</template>

<script>
	import shBanner from './components/sh-banner.vue';
	import shGridSwiper from './components/sh-grid-swiper.vue';
	import shHotGoods from './components/sh-hot-goods.vue';
	import shAdv from './components/sh-adv.vue';
	import shCoupon from './components/sh-coupon.vue';
	import shSeckill from './components/sh-seckill.vue';
	import shGroupon from './components/sh-groupon.vue';
	import shRichtext from './components/sh-richtext.vue';
	import shTitleCard from './components/sh-title-card.vue';
	import shSearch from './components/sh-search.vue';
	import shCategoryTabs from './components/sh-category-tabs.vue';

	import privacyModal from './index/privacy-modal.vue';
	import homeHead from './index/home-head.vue';
	import sunNav from './components/sun-navbar.vue'
	import sunHot from './components/sun-hot.vue'
	import sunTab from './components/sun-tabs.vue'
	import sunthreeCard from './components/sun-threeCard.vue'



	// #ifdef MP-WEIXIN
	import {
		HAS_LIVE
	} from '@/env';
	import shLive from './components/sh-live.vue';


	// #endif

	import {
		mapMutations,
		mapActions,
		mapState,
		mapGetters
	} from 'vuex';
	export default {
		components: {
			sunthreeCard,
			sunTab,
			sunHot,
			sunNav,
			shBanner,
			shGridSwiper,
			shGroupon,
			shHotGoods,
			shAdv,
			shCoupon,
			shSeckill,
			shRichtext,
			shTitleCard,
			shSearch,
			shCategoryTabs,
			privacyModal,
			homeHead,

			// #ifdef MP-WEIXIN
			shLive
			// #endif
		},
		data() {
			return {
				// #ifdef MP-WEIXIN
				HAS_LIVE: HAS_LIVE,
				// #endif
				isRefresh: true,
				CategoryId: 0,
				enable: false, //是否开启吸顶。
				isConnected: true, //是否有网
				showPrivacy: false, //协议
				scrollTop: 0,
				customBar: 0,
				bg: {
					// 背景图
					bg1: '',
					bg2: '',
					brand: '',
					hotTitle: ''
				},
				list: [],
				popularityList: [],
				emptyPic: [],
				switchShow: false,
				threeCard: [],
				bind_id: '',
				goodelist2: []
			};
		},
		created() {


			this.$http('common.getPic', {

			}).then(res => {
				if (res.code === 1) {
					uni.setStorageSync('kefu', res.data.result.kefuPhone)
					this.bg.bg1 = res.data.result.navBarBg
					this.bg.bg2 = res.data.result.navBarBg2
					this.bg.brand = res.data.result.brand
					this.bg.hotTitle = res.data.result.hotTitle
					this.emptyPic = res.data.result.emptyIcon
					this.threeCard = res.data.result.threeActives
					this.bind_id = res.data.result.bind_id
					// console.log(this.bind_id);
				}
			});

		},
		mounted() {
			this.getList()
			// this.getCategory(this.list[0].id, 0)
			uni.getSystemInfo({
				success: (e) => {

					// #ifdef MP-ALIPAY
					this.statusBar = e.statusBarHeight
					this.customBar = e.statusBarHeight + e.titleBarHeight
					//#endif

					// #ifdef APP-PLUS
					// console.log(this.statusBar);
					this.customBar = e.statusBarHeight * 2
					// #endif
				}
			})
			if (uni.getStorageSync('userInfo').id == 2) {
				this.switchShow = true
			}
			// setTimeout(()=>{
			// 	// console.log(JSON.stringify(this.homeTemplate));
			// },3000)
			// console.log(this.bind_id);
		},
		computed: {
			...mapGetters(['initShop', 'homeTemplate', 'hasTemplate', 'isLogin']),
			// 头部模块数据
			headSwiperList() {
				if (this.homeTemplate?.length) {
					return this.homeTemplate[0]?.content?.list;
				}
			},
			// 分类选项卡数据
			categoryTabsData() {
				if (this.homeTemplate?.length) {
					return this.homeTemplate[this.homeTemplate.length - 1]?.content;
				}
			}
		},
		onPullDownRefresh() {
			this.init();
		},
		onPageScroll(e) {
			// console.log(e.scrollTop);
			this.scrollTop = e.scrollTop;

		},
		onShareAppMessage() {
			if (!uni.getStorageSync('isLogin')) {
				uni.showToast({
					title: '请先登录'
				})
				return false
			}
			return {
				title: '悟空租', // 标题
				desc: '聪明租机大平台', // 描述
				path: `pages/index/indexcopy?sendId=${this.bind_id!=0?this.bind_id:uni.getStorageSync('userInfo').id}`,
				success(res) {
					console.log('success', res);
				},
				fail(res) {
					console.log('fail', res)
				},
			}

		},
		onShow() {
			let that = this;
			this.enable = true;
			this.isLogin && this.getCartList();
			// 网络变化检测
			uni.onNetworkStatusChange(res => {
				this.isConnected = res.isConnected;
				res.isConnected && this.init();
			});

			// console.log(this.refs.sunhot);
			this.$nextTick(() => {

			})
			if (uni.getStorageSync('pid')) {
				if (uni.getStorageSync('isLogin')) {
					this.$http('user.bindpid', {
						pid: uni.getStorageSync('pid')
					}).then(res => {
						uni.removeStorageSync('pid');
					})
				}
			}



		},
		onHide() {
			this.enable = false;
		},

		onLoad(e) {
			if (e) {

				if (e.sendId) {
					uni.setStorageSync('pid', e.sendId)

				}
			} else {
				var pages = getCurrentPages()[0].options;
				console.log(getCurrentPages(), 'pages');
				if (pages.sendId) {


					if (uni.getStorageSync('isLogin')) {
						this.$http('user.bindpid', {
							pid: pages.sendId
						}).then(res => {
							uni.removeStorageSync('pid');
						})

					} else {
						uni.setStorageSync('pid', pages.sendId)
					}

				}
			}



			// console.log(e);
			// console.log(options, 'e')
			// #ifdef APP-VUE
			// plus.runtime.disagreePrivacy();
			// console.log(plus.runtime.isAgreePrivacy(), 1111111111);
			// app隐私协议弹窗
			if (!plus.runtime.isAgreePrivacy()) {
				this.showPrivacy = true;
				this.showNoticeModal = false;
			}
			// #endif





			// if (options,'options') {
			// 	uni.showToast({
			// 		title:options
			// 	})
			// 	console.log(options, 'e');
			// 	// if(e.sendId){
			// 	// 	uni.setStorageSync('pid',e.sendId)
			// 	// }
			// }

			// #ifdef H5 
				this.isWechat()
			// #endif
		},
		onReachBottom() {
			this.$refs.hotgood[0].loadMore()
			// console.log(this.$refs.hotgood[0].loadMore());

		},

		methods: {
			...mapActions(['appInit', 'getTemplate', 'getCartList']),
			
			
			//判断是否在微信中
			isWechat() {
				var ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/micromessenger/i) == "micromessenger") {
					console.log(true);
					return true;
				} else {
					return false;
				}
			},
			
			
			// 子组件传送的id
			sendCategoryFn(id) {
				this.CategoryId = id

			},
			// 初始化
			init() {
				this.isRefresh = false;
				return Promise.all([this.getTemplate()]).then(() => {
					uni.stopPullDownRefresh();
					this.isRefresh = true;
				});
			},
			getList() {
				this.$http('goods.hotList', {}).then((res) => {
					if (res.code == 1) {
						this.list = res.data.list
						this.popularityList = res.data.popularityList
						this.CategoryId = this.popularityList[0].id
						this.gethotList(this.list[0].id, 0)


					}
				})
			},
			gethotList(id, index) {
				// console.log(id);
				this.$http('goods.lists', {
					category_id: id,
					keywords: '',
					page: 1
				}).then(res => {
					if (res.code === 1) {
						// console.log(res, 'hot');
						this.goodelist2 = res.data.data

					}
				});
			}

		}
	};
</script>

<style lang="scss">
	.home-wrap {
		background-color: #f4f6f4;
	}

	.header {


		position: fixed;
		top: 0;
		z-index: 999;

	}

	.template-box {
		// background:  !important;
		background: url('https://shangjia.wukongzu.com/uploads/20221206/715b80432522d48b6b18997584dcb1fe.png') no-repeat;

		.brand {
			width: 720rpx;
			height: 52rpx;
			margin: 20rpx auto;

			image {
				display: inline-block;
				width: 720rpx;
				height: 52rpx;
				box-sizing: border-box;
			}
		}
	}
</style>
